import React from 'react';
import './FilterBar.less';

const prefix = 'mctable';

function FilterBarItem({filter, removeFilter}) {
    const { key, label, text, column } = filter;
    return (
        <div className={'filter'} key={key}>
            <span className={'filter-label'}>{label}:</span>
            <span className={'filter-text'}>{text}</span>
            {!column?.filterCantRemove &&
                <span
                    className={`filter-close ${prefix}-fm ${prefix}-fm-cross`}
                    onClick={e => { removeFilter(key) }}
                />
            }
        </div>
    )
}

export default FilterBarItem;